<template>
    <div>
        <el-form ref="formData" :model="formDataInfo" label-width="120px">
            <el-row>
                <el-col :span="16" :offset="7">
                    <el-form-item label="账户类别:" class="text_fl">
                        <span class="el-form-item-span">{{isCATEGORY}}</span>
                    </el-form-item>
                </el-col>
                <el-col :span="16" :offset="7">
                    <el-form-item
                        label="挂失时间:"
                        class="text_fl"
                        v-if="formDataInfo.body.appBody.STS==='L '"
                    >
                        <span class="el-form-item-span">{{formDataInfo.getCurrentDate|isCancltm}}</span>
                    </el-form-item>
                    <el-form-item
                        label="解挂失时间:"
                        class="text_fl"
                        v-if="formDataInfo.body.appBody.STS==='  '"
                    >
                        <span class="el-form-item-span">{{formDataInfo.getCurrentDate|isCancltm}}</span>
                    </el-form-item>
                </el-col>
                <!-- <el-col :span="16" :offset="7">
                    <el-form-item label class="text_fl">
                        <div
                            class="text_span"
                        >卡片 {{formDataInfo.body.appBody.CARDNBR}} {{successText}} ！</div>
                    </el-form-item>
                </el-col>-->
            </el-row>
        </el-form>
        <div class="text_center">
            <el-button
                type="primary"
                size="small"
                plain
                @click.native="handerReissue"
                v-if="formDataInfo.body.appBody.STS==='L '"
            >补/换卡</el-button>
            <el-button type="primary" size="small" plain @click.native="handerJump">修改记录查询</el-button>
            <el-button size="small" @click.native="handleClose">关闭</el-button>
        </div>
    </div>
</template>

<script>
import moment from 'moment';
import { closePage, getDictMappingValue, trimString, getBusinessMenuId } from '@/utils/Common';
import { mapState } from 'vuex';
export default {
    name: 'CardlossOfItem',
    props: {
        formDataInfo: {
            type: Object,
        },
    },
    data() {
        return {
            isCATEGORY: '',
            MenuId: '',
        };
    },
    filters: {
        isCancltm: (value) => {
            value = (`${value}`).trim();
            if (value === '00000000') return value;
            if (value) {
                return moment(value, 'YYYYMMDD').format('YYYY-MM-DD');
            }
            return '';
        },
    },

    computed: {
        ...mapState({
            businessMenu: state => state.menu.businessMenu,
        }),
        successText() {
            let value;
            if (this.formDataInfo.sysHead.rspCd === '000000') {
                if (trimString(this.formDataInfo.body.appBody.STS) === 'L') {
                    value = `卡片挂失 ${this.formDataInfo.sysHead.rspDesc}`;
                } else {
                    value = `卡片解挂失 ${this.formDataInfo.sysHead.rspDesc}`;
                }

            } else {
                value = `错误码：${this.formDataInfo.sysHead.rspCd} ` + `错误信息：${this.formDataInfo.sysHead.rspMsg}`;
            }

            return value;
        },

    },
    mounted() {
        this.getDictValue();
    },
    methods: {
        // 账户类型 字典取值
        async getDictValue() {
            this.isCATEGORY = await getDictMappingValue('CATE', this.formDataInfo.CATEGORY, this);
        },
        // 跳转到换卡
        handerReissue() {

            this.MenuId = getBusinessMenuId('/operationDeals/ReissueCard1', this.businessMenu);
            console.log('this.MenuId____', this.MenuId);
            this.$router.push({ name: 'ReissueCard1', path: '/operationDeals/ReissueCard1', params: { id: this.MenuId } });
        },
        handerJump() {

            this.MenuId = getBusinessMenuId('/businessSystem/accountCardDetaileQuery', this.businessMenu);
            console.log('this.MenuId____', this.MenuId);
            this.$router.push({ name: 'accountCardDetaileQuery', path: '/businessSystem/accountCardDetaileQuery', params: { id: this.MenuId } });
        },
        // 点击关闭
        handleClose() {
            closePage(this.$route, this, 1);
        },

    },
};
</script>

<style lang='scss' scoped>
</style>
